<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<input id="outer-before">
<object data="resources/plugin-focus-subframe.html" type="text/html" id="obj"></object>
<embed src="resources/plugin-focus-subframe.html" type="text/html" id="emb"></embed>
<input id="outer-after">
<script>
function PressTab() {
    eventSender.keyDown('\t');
}

function PressShiftTab() {
    eventSender.keyDown('\t', ['shiftKey']);
}

function testFocusNavigation() {
    test(() => {
      var before = document.querySelector('#outer-before');
      var after = document.querySelector('#outer-after');

      before.focus();

      // 'plugin-focus-subframe.html' has 2 focus areas.
      var expected = ['outer-before', 'obj', 'obj', 'emb', 'emb', 'outer-after'];

      var i;
      for (i = 0; i < 5; ++i) {
          assert_equals(document.activeElement.id, expected[i]);
          PressTab();
      }
      assert_equals(document.activeElement, after, '#after');

      expected.reverse();
      for (i = 0; i < 5; ++i) {
          assert_equals(document.activeElement.id, expected[i]);
          PressShiftTab();
      }
      assert_equals(document.activeElement, before, '#before');

    }, "Focus should navigate to <option>/<embed>");
}

if (window.testRunner) {
    window.addEventListener('load', testFocusNavigation, false);
}
</script>
